<template>
  <el-container>
    <el-main>
      <div class="default-main ba-table-box">
        <TableHeader
          :buttons="['refresh', 'columnDisplay']"
          :quick-search-placeholder="placeholder"
          @action="baTable.onTableHeaderAction"
        />
        <!-- 表格 -->
        <!-- 要使用`el-table`组件原有的属性，直接加在Table标签上即可 -->
        <Table
          ref="tableRef"
          :pagination="false"
          @action="baTable.onTableAction"
        />
      </div>
    </el-main>
  </el-container>
</template>
<script lang="ts" setup>
import { ref, provide, onMounted, inject, reactive } from "vue";
import baTableClass from "@/utils/baTable";
import { baTableApi, DictOperation } from "@/utils/common"; // 导入表格api方法生成器
import Table from "@/components/table/index.vue";
import TableHeader from "@/components/table/header/index.vue";
import useCurrentInstance from "@/utils/useCurrentInstance";
import type { TableRow, TableColumn } from "@/utils/baTable"; //表格列行类型
import { ElectricYearAnalysis } from "@/api/backend/index";
import { useRoute, useRouter } from "vue-router";
import { useNavTabs } from "@/store/navTabs";
import { useElectricData } from "@/store/backend/DataM/RealTime";
import { useDictionary } from "@/store/backend/tool/dictionary";
import { useAssetSite } from "@/store/backend/Assets/site";
import { useAssetCabinet } from "@/store/backend/Assets/cabinet";

const placeholder = ref<string>("模糊搜索");
const tableRef = ref();
const route = useRoute();
const router = useRouter();
const navTabs = useNavTabs();
const realTime = useElectricData();
const dictionary = useDictionary();
const site = useAssetSite();
const cabinet = useAssetCabinet();
const itemObject = inject("itemObject") as any;
const analysis = inject("analysis") as any;
const yoyStore = inject("yoyStore") as any;

const formRef = ref();

//字段显隐记忆功能
const filedShowOff = (filter: any) => {
  if ((navTabs as any).columnDisplayStoreMap) {
    return (navTabs as any).columnDisplayStoreMap.get(
      route.path + "/" + filter
    );
  }
  return true;
};
// 每页个数记忆功能
const pageSizeKeep = () => {
  if ((navTabs as any).pageSizeMap) {
    return (navTabs as any).pageSizeMap.get(route.path + ElectricYearAnalysis)
      ? (navTabs as any).pageSizeMap.get(route.path + ElectricYearAnalysis)
      : 10;
  }
  return 10;
};

//初始化字典处理类
const dictOperation = new DictOperation();

// interface Props {
//   modelValue: any;
// }

// const props = withDefaults(defineProps<Props>(), {
//   modelValue: () => "",
// });

const state: {
  defaultFileds: any[]; //默认内循环温度
} = reactive({
  defaultFileds: [],
});

//全局事件总线
const { proxy } = useCurrentInstance();
const baTable = new baTableClass(
  new baTableApi(ElectricYearAnalysis), //this.api = api菜单管理相关
  {
    pk: "id",
    column: [
      { type: "selection", align: "center", operator: false },

      {
        label: "月份",
        prop: "bymonth",
        align: "center",
        operator: false,
      },
      {
        label: "本期",
        prop: "num",
        align: "center",
        operator: false,
      },
      {
        show: filedShowOff("lastnum"),
        label: "同期",
        prop: "lastnum",
        align: "center",
        operator: false,
      },
      {
        show: filedShowOff("byyear"),
        label: "同比",
        prop: "byyear",
        align: "center",
        operator: false,
      },
      {
        show: filedShowOff("sumbyyear"),
        label: "累计同比",
        prop: "sumbyyear",
        align: "center",
        operator: false,
      },
      //   {
      //     label: "合计",
      //     prop: "count",
      //     align: "center",
      //     render: "customTemplate",
      //     fixed: "right",
      //     customTemplate: (
      //       row: TableRow,
      //       field: TableColumn,
      //       value: any,
      //       column: TableColumnCtx<TableRow>,
      //       index: number
      //     ) => {
      //       let count = 0;
      //       for (const key in row) {
      //         if ((key + "").includes("hour")) {
      //           count += row[key];
      //         }
      //       }
      //       return "<b>" + count + "</b>";
      //     },
      //     operator: false,
      //   },
    ],
    filter: {
      ecode: yoyStore.ecode,
      date: yoyStore.date,
      pageNum: 1,
      pageSize: 900000,
    },
    extend: {
      // summary: true, //合计方法
    },
    acceptQuery: false, //不接受url的query参数并自动触发通用搜索
  },
  {
    // 默认表单数据(添加)
    defaultItems: {},
  },
  {},
  {
    getList: ({ res }: { res: any }) => {
      proxy.eventBus.emit("yoyData", res.rows);
    }, // 查看后
  }
);

onMounted(() => {
  baTable.table.ref = tableRef.value;
  baTable.mount();
  baTable.getList(ElectricYearAnalysis);

  /**
   * 表格内的按钮响应
   * @param name 按钮name
   * @param row 被操作行数据
   */
  proxy.eventBus.on(
    "onTableButtonClick",
    (data: { name: string; row: TableRow }) => {
      if (!baTable.activate) return;
      //回滚功能暂无
      if (data.name == "rollback") {
        // onRollback([data.row[baTable.table.pk!]])
      } else if (data.name == "info") {
        //携带主键字段pk
        // infoButtonClick(
        //   (data.row as TableRow)[baTable.table.pk!],
        //   data.row as any
        // );
      }
    }
  );
});

//获取字典
const getDictionary = () => {};
getDictionary();

// 实例化表格后，将 baTable 的实例提供给上下文
provide("baTable", baTable);
provide("site", site);
provide("dictionary", dictionary);

defineExpose({});
</script>
<style lang="scss" scoped>
.el-main {
  padding: 0;
}
.default-main {
  margin: var(--ba-main-space) var(--ba-main-space) 60px var(--ba-main-space);
}
</style>
